<template>
    <div v-show="!item.isHide" :class="{'animated':isDel,'zoomOutUp':isDel}" class="card">
        <div class="cardhead">
            <van-checkbox   v-model="item.checked"><b>批号{{item.cFactorybatchno}}</b> <span>&lt; {{((item.PriceType="毛重" && item.BatchType!=2)?item.nGrossweight/1000: item.nStdweight).toFixed(3)}}吨&gt;</span></van-checkbox>
            <h5>{{item.BatchYear}} {{item.cMadein}} {{isJK?item.J_DJ:item.nColorgd}} {{isJK?item.J_CD:item.nAvglength}} {{isJK?item.J_QL:item.nAvgintension}} {{isJK?(item.J_MZ1+'-'+item.J_MZ2):item.nAvgmike}} {{item.nAvgrd}}</h5>
        </div>
        <div class="content">
            <!-- <h4>【提货单号】<b>9504 0个柜</b></h4> -->
            <h4>【联系方式】<b>{{item.LinkMan}}</b> <a :href="'tel:'+item.LinkTel">{{item.LinkTel}}</a> </h4>
            
            <h4>【交货仓库】<b>{{item.SellStorage}}</b></h4>
            <!-- <h4>【交货方式】<i class="iconfont" @click="itemClick(0)" :class="{'icon-radioactive':item.JHFS==0,'icon-radio':item.JHFS==1}"></i> 送货到厂<i @click="itemClick(1)" class="iconfont" :class="{'icon-radioactive':item.JHFS==1,'icon-radio':item.JHFS==0}"></i>仓库自提
            </h4> -->
            <h4 v-show="item.JHFS==1">【收货地址】<input type="text" v-model="item.SHDZ"></h4>
            <h4>【成交方式】{{sellType[parseInt(item.SellType)-1]}}  
            </h4>
            <h2></h2>
            <h4>【自提单价】<b class="red">{{item.SellPrice}}</b>{{item.BatchType==2?'美分/磅':'元/吨'}}</h4>
            <!-- <h4>【订单金额】<b class="red">{{(item.SellPrice*item.nGrossweight/(isJK?1000:1000)).toFixed(0)}}</b>{{item.BatchType==2?'美元':'元'}}</h4> -->
            <i @click="delItem" class="iconfont icon-shanchu1"></i>
        </div>
    </div>
</template>

<script>
import api from '@/api/api'
   import {Toast} from 'vant';

    export default {
        props: {
            item: Object
        },
        data() {
            return {
                isDel:false,
                sellType:['现价成交','期货点价','远期交货']
            }
        },
        computed: {
            isJK: function() {
                return (this.item.BatchType == 2 || this.item.BatchType == 3);
            }
        },
        methods: {
            itemClick(v) {                
                this.item.JHFS = v;
            },
            addToCart(){

                var para={
                    BatchNo:this.item.cFactorybatchno,
                    OpenID:this.$store.state.userInfo.OpenID,
                    
                }
                api.addToCard(para).then(res=>{
                    if(res.success)
                    {
                        Toast.success(res.msg);
                        
                    }else
                    {
                        Toast.fail(res.msg);
                    }
                })
            },
            delItem() {
                this.isDel = true;
                this.addToCart();
                this.$emit('success', this.item);
            }
        },
    }
</script>

<style scoped lang='less'>
    .card {
        border-radius: 10px;
        border: 1px solid #ccc;
        font-size: 14px;
        background: #fff;
        margin-bottom: 10px;
        text-align: left;
        overflow: hidden;
        margin: 0.5em;
        letter-spacing: 0.05em;
        position: relative;        
        .cardhead {
            background: #f0f0f0;
            padding: 0.5em;
             
            h5 {
                margin-left: 2.5em;
                color: #000;
            }
        }
        .content {
            padding: 0.5em;
            >i {
                position: absolute;
                top: 0.3em;
                right: 0.3em;
                font-size: 22px;
                color: #ccc;
            }
        }
        h2 {
            border-bottom: 1px solid #f0f0f0;
            margin: 0.2em 0;
        }
        .ccc {
            color: #999;
        }
        h4 {
            font-weight: normal;
            i {
                color: #2cb98e;
            }
        }
    }
</style>